<template>
    <el-select
        v-model="model"
        :remote-method="queryList"
        :loading="loading"
        :placeholder="showTip?showTip:$t('common.text.all')"
        :multiple="multiple"
        :disabled="disabled"
        :multiplelimit="multiplelimit"
        :size="size"
        :value-key="getValueKey()"
        :key="defaultKey"
        filterable
        remote
        reserve-keyword
        clearable
        style="width: 100%;"
        @change="handleChange"
    >
        <el-option
            v-for="(item,index) in dataList"
            :key="index"
            :label="item.label"
            :value="item.value"
        ></el-option>
    </el-select>
</template>
<script>
import { findClassroomPage } from "common/src/api/resource/classroom";
import UTILS from "common/src/utils/utils";
import mixin from 'common/src/mixins/index';
/**
 * 老师下拉框组件
 */
export default {
    name: "ClassRoomSelect",
    mixins: [mixin],
    model: {
        prop: "model",
        event: "change"
    },
    props: {
        model: {
            default: null,
            validator: function(value) {
                // v-model不能为null
                const valide = value !== null && value !== undefined;
                if (!valide) {
                    console.warn("v-model不能为null");
                }
                return valide;
            }
        }, // 父组件通过v-model传过来, 如果传来的值为null为出现 Cannot read property 'some' of null
        multiple: {
            type: Boolean,
            default: false
        },
        valueKey: {
            type: String,
            default: "id"
        },
        value: null,
        disabled: {
            type: Boolean,
            default: false
        },
        size: {
            type: String,
            default: ""
        },
        multiplelimit: {
            type: Number,
            default: 0
        },
        conditionNotNull: {
            // 如果为false则会在查询条件有值时才查询数据
            type: Boolean,
            default: true
        },
        condition: {
            type: Object,
            default: null
        },
        permissionBlank: {
            type: Boolean,
            default: false
        },
        showTip: {
            type: String,
            default: ""
        },
        addGruadateFaculty: {
            type: Boolean,
            default: false
        },
        defaultKey: {
            default: null
        }
    },
    data() {
        return {
            dataList: [],
            loading: false,
            isRemoteSearch: false // 是否远程搜索
        };
    },
    mounted() {
        this.init();
    },
    created() {},
    watch: {
        condition: {
            deep: true,
            handler: function(newVal, oldVal) {
                this.isRemoteSearch = false;
                this.init("", true);
            }
        }
    },
    methods: {
        getValueKey() {
            return this.valueKey;
        },
        getValue(item) {
            if (UTILS.isEmpty(this.value)) {
                return item;
            }
            return item[this.value];
        },
        handleChange(val) {
            this.$emit("change", val);
        },
        init(name, isQuery) {
            if (this.conditionNotNull && UTILS.isEmpty(this.condition)) {
                return;
            }
            let queryData = UTILS.clone(
                this.condition == null ? {} : this.condition
            );
            if (
                _.isNull(queryData.pageSize_) ||
                _.isUndefined(queryData.pageSize_)
            ) {
                queryData.pageSize_ = 50;
            }
            if (
                _.isNull(queryData.pageNum_) ||
                _.isUndefined(queryData.pageNum_)
            ) {
                queryData.pageNum_ = 1;
            }
            queryData.conditionValue = name;
            if (this.addGruadateFaculty) {
                let role = this.global.currentUser.innerRoles;
                if (role.includes("2")) {
                    var facultyList = [
                        {
                            departmentCode: "000014"
                        }
                    ];
                    facultyList.push({
                        departmentCode: this.global.currentUser.faculty
                    });
                    queryData.fixDepartmentList = facultyList;
                }
            }
            findClassroomPage(queryData).then(res => {
                this.loading = false;
                this.dataList = this.formatOptions(res.data.list);
                this.$emit("load-done", this.dataList);
            });
        },
        formatOptions(data) {
          let dataset = [];
            data.forEach(item => {
              dataset.push({
                label: this.getLabel(item),
                value: this.getValue(item),
                ...item
              });
            })
            return dataset;
        },
        getLabel(item) {
            if (item.towerName != null && item.classCapacity != null){
                return item.name + "(" + item.towerName + ")" + "-" + item.classCapacity;
            }else if (item.towerName != null) {
                return item.name + "(" + item.towerName + ")";
            } else {
                return item.name;
            }
        },
        queryList(query) {
            this.isRemoteSearch = true;
            if (this.permissionBlank) {
                this.loading = true;
                this.init(query, true);
            } else {
                if (query !== "") {
                    this.loading = true;
                    this.init(query, true);
                }
            }
        }
    }
};
</script>

<style scoped>
</style>
